<template>
	<div>
		<el-menu v-for="(menu,index) in menus" @select="selectNav" default-active="2" class="el-menu-vertical-demo"
			background-color="#545c64" text-color="#fff" active-text-color="#ffd04b" :key="index">

			<el-submenu v-if="menu.listMenus!=null && menu.listMenus.length>0" :index="index+''">
				<template slot="title">
					<i :class="menu.menuIcon"></i>
					<span slot="title">{{menu.menuName}}</span>
				</template>
				<el-menu-item-group>
					
					<menus :menus="menu.listMenus"></menus>

					<!-- 							<el-menu-item-group>
								<el-menu-item index="/main/classesInfo">班级信息管理</el-menu-item>
								<el-menu-item index="3-2">学员基础信息管理</el-menu-item>
							</el-menu-item-group> -->
				</el-menu-item-group>
			</el-submenu>

			<el-menu-item v-if="menu.listMenus==null || menu.listMenus.length<=0" :index="menu.menuRoute+''">
				<i :class="menu.menuIcon"></i>
				<span slot="title">{{menu.menuName}}</span>
			</el-menu-item>
		</el-menu>
	</div>
</template>
<script>
	export default {
		name: 'Menus',
		methods: {
			selectNav(index) {
				// console.log(index)
				this.$router.push(index);
			}
		},
		props: ['menus']
	}
</script>


<style>

</style>
